<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<h3>javascript访问DOM 数案例</h3>
		 
		  <!--target="_blank" 跳转新窗口打开-->
		<h5>tag classname name id </h5>
		<a  href="https://www.baidu.com/" target="_blank"  >淘宝</a>
		<a class="jd "href="https://www.jd.com/"  target="_blank">京东</a>
		<a  name="pdd"  href="https://www.baidu.com/"  target="_blank">3</a>
		<a  id= "bd" href="https://www.baidu.com/"  target="_blank">4</a>
		<!--页面使用javascript
		type="text/javascript" 可以省略
		scr=""引入外部js jQuery.js
		js中使用双引号把字符串括起来
		-->
		<script >
		window.alert('使用js获取页面元素内容'); //bom中提供弹出框API 
		
		<!--获取页面a标签，按tagname方式返回一个数组
		//第一个元素:arr[0],下标从0开始
		//js出错 f12 可以控制台检查
		//谷歌浏览器提供console方式-->
		//第一种方式TagName
		console.log(document.getElementsByTagName("a")
		[0].innerText);
		console.log(document.getElementsByTagName("a")
		[0].href);//得到页面上所有的a元素
		//第二种方式 classname方式
		console.log(document.getElementsByClassName("jd")
		[0].innerText);
		console.log(document.getElementsByClassName("jd")
		[0].href);
		//第三种方式 name方式
		console.log(document.getElementsByName("pdd")
		[0].innerText);
		console.log(document.getElementsByName("pdd")
		[0].href);
		//第四种方式 id方式 获得一个值 无需数组方式
		console.log(document.getElementById("bd").innerText);
		console.log(document.getElementById("bd").href);
		//修改页面值
	//	document.getElementsByTagName("a")[0].innerText="百度";
	//	document.getElementsByTagName("a")[0].href="https://www.baidu.com/";
	
		var a = document.getElementsByTagName("a")[0];
		 a.innerText="等天黑";
			a.href="www.4399.com";
	
		</script>
	</body>
</html>

















